<style scoped="scoped">
	.RectangleAdvertising{
		background-size:100% 100% ; 
		height: 8rem;
	}
	
</style>
<template>
  <grid :cols='1'>
    <grid-item 
    	 v-for="(value,index) in rectangularAdvertising"  
    	 :key="index"  
    	 class=" RectangleAdvertising" 
    	 link="/activePage"  
    	 :style="{backgroundImage: buildBackground(value)}" >
    </grid-item>

  </grid>
</template>

<script>
import { Grid, GridItem } from 'vux'
import Data from '@/server/server.js'
export default {
  components: {
    Grid,
    GridItem
  },
  data () {
    return {
      rectangularAdvertising:[]
    }
  },
  methods:{
    buildBackground (item) {
      return `url(${item.image})`
    }
  },
  mounted (){
  	Data.rectangularAdvertising.then(data => {
  		this.rectangularAdvertising=data;
  		this.$parent.$refs.bottomGoods.bindSticky ()
  	})
  }
}
</script>